import type { ConfigProviderProps } from "naive-ui";
import { createDiscreteApi } from "naive-ui";
import { darkTheme, lightTheme } from "naive-ui";
import { computed } from "vue";
import { useThemeStore } from "@/stores/theme";

const themeStore = useThemeStore();
const configProviderPropsRef = computed<ConfigProviderProps>(() => ({
  theme: themeStore.theme === "light" ? lightTheme : darkTheme,
}));

const { message, dialog, notification } = createDiscreteApi(
  ["message", "dialog", "notification"],
  {
    get configProviderProps() {
      return configProviderPropsRef.value;
    },
  },
);

export { message, dialog, notification };
